<template>
  <a-menu mode="inline">
    <a-sub-menu :key="item.key" v-if="item.children">
      <span slot="title"><a-icon :type="item.icon" />{{ item.title }}</span>
      <a-menu-item :key="item1.key" v-for="item1 in item.children">
        <router-link :to="item1.path || '/'"
          ><a-icon :type="item1.icon" /> {{ item1.title }}</router-link
        >
        <menuTree v-if="item1.children" :item="item1.children"></menuTree>
      </a-menu-item>
    </a-sub-menu>
    <a-menu-item v-else :key="item.key">
      <router-link :to="item.path || '/'"
        ><a-icon :type="item.icon" /> {{ item.title }}</router-link
      >
    </a-menu-item>
  </a-menu>
</template>

<script>
export default {
  props: {
    item: {
      type: Object
    }
  },
  created() {
    console.log(this.item)
  }
}
</script>

<style></style>
